<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <title>Document</title>
  <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/layui/css/layui.css">
  <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/main.css">
<!--加载meta IE兼容文件-->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
</head>
<body>
  	<div class="header">
		<div class="menu-btn">
			<div class="menu"></div>
		</div>
		<h1 class="logo">
			<a href="index.jsp"> <span>MYBLOG</span> <img src="img/logo.png">
			</a>
		</h1>
		<div class="nav">
			<a href="index" >文章</a>
			<a href="leacots" class="active">留言</a> <a href="album">相册</a> 
			<a href="about">我的文章</a>
		</div>
		<ul class="layui-nav header-down-nav">
			<li class="layui-nav-item"><a href="index" >文章</a></li>
			<li class="layui-nav-item"><a href="leacots" class="active">留言</a></li>
			<li class="layui-nav-item"><a href="album">相册</a></li>
			<li class="layui-nav-item"><a href="about">我的文章</a></li>
			<li class="layui-nav-item"><a href="about">文章详情</a></li>
		</ul>
		<p class="welcome-text">
			欢迎<span class="name" style="color:red;font-size:30px;">${user.u_name }</span>来到Myblog~
		</p>
	</div>
  




  <div class="content whisper-content leacots-content">
    <div class="cont w1000">
      <div class="whisper-list">
        <div class="item-box">
          <div class="review-version">
              <div class="form-box">
             
                <img class="banner-img" src="${pageContext.request.contextPath}/img/liuyan.jpg">
                <div class="form">
              
                </div>
              </div>
              <div class="volume">
                全部留言 <span>10</span>
              </div>
              <div class="list-cont">
                  
                  <c:forEach items="${selectMessageByOther }" var="selectMessageByOtheraaa">
                <div class="cont">
                  <div class="img">
                    <img src="${pageContext.request.contextPath}/img/header.png" alt="">
                  </div>
                  
                  <div class="text">
                    <p class="tit"><span data-method="setTop" class="adminBtn" data-id="${selectMessageByOtheraaa.m_fromuserId.u_id }">${selectMessageByOtheraaa.m_fromuserId.u_name }</span><span style="margin-left: 20px;color: red;">id:${selectMessageByOtheraaa.m_fromuserId.u_id }</span><span class="data"><fmt:formatDate value="${selectMessageByOtheraaa.m_reviewTime }"/> </span></p>
                    <p class="ct">${selectMessageByOtheraaa.m_content }</p>
                  </div>
                </div>
                 </c:forEach>
                     
            
              </div>
          </div>
        </div>
      </div>
      <div id="demo" style="text-align: center;"></div>
    </div>
  </div>
  <script type="text/html" id="laytplCont">
    <div class="cont">
      <div class="img">
        {{#  if(d.avatar){ }}
        <img src="{{d.avatar}}" alt="">
        {{#  } else { }}
        <img src="${pageContext.request.contextPath}/img/header.png" alt="">
        {{# } }}
      </div>
      <div class="text">
        <p class="tit"><span class="name">{{d.name}}</span><span class="data">2018/06/06</span></p>
        <p class="ct">{{d.cont}}</p>
      </div>
    </div>
  </script>
  <div class="footer-wrap">
    <div class="footer w1000">
      <div class="qrcode">
        <img src="${pageContext.request.contextPath}/img/erweima.jpg">
      </div>
      <div class="practice-mode">
        <img src="${pageContext.request.contextPath}/img/down_img.jpg">
        <div class="text">
          <h4 class="title">我的联系方式</h4>
          <p>微信<span class="WeChat">HL2579573616</span></p>
          <p>手机<span class="iphone">18874121573</span></p>
          <p>邮箱<span class="email">2579573616@qq.com</span></p>
        </div>
      </div>
    </div>
  </div>
  
  <script type="text/javascript" src="${pageContext.request.contextPath}/layui/layui.js"></script>
  <script type="text/javascript">
  layui.use('layer', function() { //独立版的layer无需执行这一句
		var $ = layui.jquery, layer = layui.layer; //独立版的layer无需执行这一句
		//触发事件
		  var active = {
		    setTop: function(){
		      var that = this; 
		      var uid = $(that).attr('data-id');
		      //多窗口模式，层叠置顶
		      layer.open({
		        type: 2 //此处以iframe举例
		        ,title: '留言'
		        ,area: ['800px', '400px']
		        ,shade: 0
		        ,maxmin: true
		        ,content: 'message?u_id='+uid
		        ,btn: [ '退出'] //只是为了演示
		        ,btn1: function(){
		        	layer.closeAll();
		        }
		       
		        /* ,zIndex: layer.zIndex //重点1 */
		        ,success: function(layero){
		          /* layer.setTop(layero); //重点2 
		        	if(uid==${user.u_id}){
		        		alert("不能给自己留言");
		        		layer.closeAll();
		        	}*/
		        }
		      });
		    }
		}
		  $('.adminBtn').on('click', function(){
			    var othis = $(this), method = othis.data('method');
			    active[method] ? active[method].call(this, othis) : '';
			  });
	})
  
  
  
  
  
  
  
   layui.config({
      base: '${pageContext.request.contextPath}/js/util/'
    }).use(['element','laypage','form','menu'],function(){
      element = layui.element,laypage = layui.laypage,form = layui.form,menu = layui.menu;
      laypage.render({
        elem: 'demo'
        ,count: 70 //数据总数，从服务端得到
      });
      menu.init();
      menu.submit()
    })
  </script>
  <script type="text/javascript">
  	$(function(){
  		$('#message').submit(function(){
  			var m_content=$("textarea[name='m_content']").val();
  			
  			$.post("message",{
  				"m_content":m_content
  			})
  		},function(resp){
  			alert("留言成功");
  		})
  		return false;
  		
  	})
  
  
  </script>
</body>
</html>